<template>
  <van-swipe
    v-if="banners.length"
    class="my-swipe"
    :autoplay="3000"
    indicator-color="white"
  >
    <van-swipe-item v-for="(item, index) in banners" :key="index">
      <img :src="item.img_url" alt="" />
    </van-swipe-item>
  </van-swipe>
</template>
<script>
import { Swipe, SwipeItem } from "vant";

export default {
  name: "HomeSwiper",
  props: {
    banners: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  components: {
    [Swipe.name]: Swipe,
    [SwipeItem.name]: SwipeItem,
  },
};
</script>

<style>
img {
  width: 100%;
  height: auto;
}
</style>